<template>
	<view class="content-img">
		<view class="header-content flex justify-content-space-between" :style="{paddingTop: statusBarHeight}">
			<view style="width: 100rpx;" @click="onTapLeft"><eui-uicons color="#000" type="back" size="40" /></view>
			<view style="font-size: 36rpx;font-weight: 600;">{{c_title}}</view>
			<view class="flex justify-content-flex-end" style="width: 100rpx;" @click="EditUserData"
				v-if="industryTabIndex==0">
				<view class="iconfont icon-piliangchuli"
					:style="{color:isShowCheckbox?'RGBA(127, 127, 127, 1)':'#000'}"></view>
			</view>
			<view class="flex justify-content-flex-end" style="width: 100rpx;" v-else>
			</view>
		</view>
		<eui-search-bar v-model="searchValue" @confirm="selStoreById" radius="100" placeholder="标题、单号搜索">
		</eui-search-bar>
	</view>
	<view class="main-view">
		<scroll-view scroll-y lower-threshold='88' @refresherrefresh="onRefresh" @scrolltolower="templateLower"
			:refresher-enabled='true' :refresher-triggered="triggered" :style="{width:scrollWidth,height:scrollHeight}">
			<view class="approve-list flex font-size-28 margin-bottom-20" v-for="(item,index) in dataList" :key="index">
				<view class="flex align-items-center" v-if="isShowCheckbox">
					<checkbox value="cb" :checked="item.c_checked" @click="()=>{item.c_checked = !item.c_checked}"
						style="transform:scale(0.8)" :color="themeColor" :class="[theme]" />
				</view>
				<view class="flex flex-1 flex-direction-column">
					<view class="flex justify-content-space-between" @click="OpenApproveDetail(item)">
						<view class="flex flex-1 font-size-32 font-weight-bold justify-content-space-between">
							<view class="flex align-items-center">
								<view class="status-radius margin-right-10"
									v-if="industryTabIndex==0&&item.ReadStatus!='已阅'"></view>
								{{item.BillId}}
							</view>
							<eui-tag :text="item.AppType" :bgColor="themeBgColor" :showBorder="false"
								:color="themeColor" v-if="industryTabIndex!=2&&industryTabIndex!=3"></eui-tag>
						</view>
					</view>
					<view class="flex margin-top-16" @click="OpenApproveDetail(item)">
						<view class="bill-title" :style="{width:viewWidth}">{{item.BillTitle.replace(':',' ')}}</view>
					</view>
					<view class="flex margin-top-16">
						<view class="flex flex-1" v-if="industryTabIndex==0||industryTabIndex==1"><span
								class="color-888">发送人 </span>{{item.SendUserName}}</view>
						<view class="flex flex-1" v-if="industryTabIndex==0">
							{{dayjs(item.c_start_dt).format('YYYY-MM-DD HH:mm:ss')}}</view>
						<view class="flex flex-1" v-if="industryTabIndex==1">
							{{dayjs(item.Start_dt).format('YYYY-MM-DD HH:mm:ss')}}</view>
					</view>
					<view class="flex margin-top-16" v-if="industryTabIndex==0">
						<view class="flex flex-1">{{item.StepName}}</view>
					</view>
					<view class="flex margin-top-16" v-if="industryTabIndex==1">
						<view class="flex flex-1"><span class="color-888">审批时间 </span>{{item.c_rec_dt}}</view>
					</view>
					<view class="flex margin-top-16" v-if="industryTabIndex==2">
						<view class="flex flex-1"><span class="color-888">发送时间 </span>{{item.c_start_dt}}</view>
					</view>
					<view class="flex margin-top-16" v-if="industryTabIndex==3">
						<view class="flex flex-1"><span class="color-888">驳回人 </span>{{item.UserName}}</view>
						<view class="flex flex-1">{{item.c_rec_dt}}</view>
					</view>
					<view class="flex margin-top-16" v-if="industryTabIndex==3">
						<view class="flex flex-1">{{item.StepName}}</view>
					</view>
					<view class="padding-top-20" v-if="!isShowCheckbox">
						<ApproveBottomBar :data="item" :Index="index+1" :isStatus="true" :tabIndex="industryTabIndex"
							@change="onApproveCB">
						</ApproveBottomBar>
					</view>
				</view>
			</view>
			<view v-if="dataList.length == 0" class="no-data flex flex-direction-column"
				style="background-color: RGBA(255,255,255,0);">
				<image src="@/static/img/no_data.png" mode="aspectFit" class="image" />
				<view class="color-888 font-size-28">暂无数据</view>
			</view>
		</scroll-view>
		<view class="user-footer justify-content-space-between" v-if="isShowCheckbox">
			<checkbox-group @change="checkboxChange">
				<label>
					<checkbox value="allCheck" :checked="isAllChecked" style="transform:scale(0.8)"
						:color="themeColor" :class="[theme]"/>全选
				</label>
			</checkbox-group>
			<view style="height: 68rpx;">
				<eui-button type="max2" title="取消" @click="EditUserData" style="margin-right: 20rpx;" />
				<eui-button type="max" title="批量同意" @click="BatchApprove" />
			</view>
		</view>
		<eui-popup ref="popup3" type="center">
			<view class="batchApproveResult">
				<view style="border-bottom: solid 1px #f8f8f8;padding: 10px;">成功：{{SuccessCount}}个，失败：{{FailCount}}个
				</view>
				<view style="padding: 10px;" v-for="(item,index) in lstBatchfail" :key='index'>
					<view style="font-size: 16px;">{{item.BillId}}</view>
					<view class="batchApproveResult-error">{{item.ErrInFo}}</view>
				</view>
			</view>
		</eui-popup>
	</view>
</template>

<script setup type="ts">
	import { ref } from 'vue';
	import dayjs from 'dayjs';
	import { onLoad,onReady } from '@dcloudio/uni-app';
	import service from '@/common/service';
	import Enjoy from '@/common/enjoy';
	import { useMainStore } from '@/store/modules/store';
	import { useLoginStore } from '@/store/modules/useLoginStore';
	import { useThemeStore } from '@/store/themeStore';
	import ApproveBottomBar from'@/components/ApproveBottomBar.vue'
	import eventBus from '@/pages/MainViews/eventBus';
	import { storeToRefs } from 'pinia';
	const mainStore = useMainStore();
	const LoginStore = useLoginStore();
	const themeStore = useThemeStore(); // 主题
	const { theme } = storeToRefs(themeStore);

	const themeBgColor = ref(themeStore.theme == 'theme-blue' ? 'rgba(224, 239, 255, 0.5)' : 'rgba(255, 239, 224, 0.5)')
	const themeColor = ref(themeStore.theme == 'theme-blue' ? '#02B7E6' : '#FF6430')

	const statusBarHeight = ref(uni.getSystemInfoSync().statusBarHeight + 'px');
	const scrollWidth = ref(uni.getSystemInfoSync().windowWidth - 20 + 'px');
	const viewWidth = ref(uni.getSystemInfoSync().windowWidth - 45 + 'px');
	const scrollHeight = ref(uni.getSystemInfoSync().windowHeight + 'px');
	const searchValue = ref('');
	const triggered = ref(false);
	const c_title = ref('');
	const industryTabIndex = ref(0);
	const dataList = ref([]);
	const delSort = ref([]);
	const approveInfo = ref({});
	const reqInfo = ref({});
	const reqUser = ref({});
	const searchInfo = ref({
		searchValue:'',
		StartDt:'',
		EndDt:'',
		sendUser:'',
	});
	const PageSize = ref(10);
	const pageList = ref({
		CurrentPage: 1, //第几页
		RowsCount: 0, //总条数
		PageCount: 1, //总页数
	});
	const isShowCheckbox = ref(false);
	const isAllChecked = ref(false);
	const SuccessCount = ref(0);
	const FailCount = ref(0);
	const lstBatchfail = ref([]);
	const popup3 = ref(null);
	const refresherEnabled = ref(true);

	const onTapLeft = () =>{
		uni.navigateBack();
	}
	const EditUserData = () =>{
		isAllChecked.value = false;
		for (let i = 0; i < dataList.value.length; i++) {
			dataList.value[i].c_checked=false
		}
		uni.getSystemInfo({
			success: function(res) {
				const userInfoPage = uni.createSelectorQuery().select(".content-img");
				userInfoPage.boundingClientRect(function(data) {
					if(isShowCheckbox.value){
						isShowCheckbox.value = false;
						scrollHeight.value = (res.windowHeight - data.height - 10 )+'px';
						viewWidth.value = (res.windowWidth - 45) + 'px';
					}else{
						isShowCheckbox.value = true;
						scrollHeight.value = (res.windowHeight - data.height - 45 )+'px';
						viewWidth.value = (res.windowWidth - 75) + 'px';
					}
				}).exec()
			}
		});
	}
	const checkboxChange = e =>{
		for (let i = 0; i < dataList.value.length; i++) {
			dataList.value[i].c_checked=e.detail.value&&e.detail.value.length>0?true:false
		}
	}
	const BatchApprove = () =>{
		console.log("dataList.value: " + JSON.stringify(dataList.value));
		const list = dataList.value.filter(item=>item.c_checked);
		if(list.length==0){
			uni.showToast({
				duration: 3500,
				icon: 'none',
				title: '请先勾选单据!',
				mask: true,
			});
			return false
		}
		uni.showModal({
			title: '提示',
			content: '您选择了' + list.length + '个单据进行审批，请确认!',
			showCancel: true,
			success: (res) => {
				if (res.confirm) {
					BatchApproveFor5(list)
				} else {
				}
			}
		});
	}
	const BatchApproveFor5 = async(e) =>{
		service.enjoyShowLoading('您勾选了' + e.length + '个，正在审批第1个...');
		let batchId = 1;
		let batchSelectedCount = 0;
		let lstSelectedBill = [];
		let batchExcutedCount = 0;
		SuccessCount.value = 0;
		FailCount.value = 0;
		let iSuccessCount = 0;
		lstBatchfail.value = [];

		for (let i = 0; i < e.length; i++) {
			let item = e[i];
			lstSelectedBill.push({
				AppId: item.AppId,
				AppRecvId: item.AppRecvId,
				MsgId: item.MsgId,
				MsgRecvId: item.MsgRecvId,
				ApproveType: item.AppType,
				BillId: item.BillKey,
				BillRealId: item.BillId,
				NodeId: item.AppNodeId,
				batchId: batchId
			});
			batchSelectedCount++;
			//每5个一批
			if ((batchSelectedCount % 5 == 0 || (i + 1 == e.length)) && lstSelectedBill.length > 0) {
				let request = {
				    url: LoginStore.EnjoyMain,
				    data: {
				        UniqueKey: "管易通40审批",
				        ObjectData: {
							AppUserNo: mainStore.loginInfo.sUser,
							BillName: approveInfo.value.BillType,
							AppRecvInFos: lstSelectedBill,
							BillRealName: e[0].BillRealType
						},
				        MethodName: "BatchApproveProcess",
				    },
				}
				await service.request(request, (res) => {
				    if (res && res.data) {
				        if (!res.data.HasException) {
							const ObjectData = res.data.ObjectData;

							batchExcutedCount = batchExcutedCount + (ObjectData.ScuessAppIds != null &&	ObjectData.ScuessAppIds != undefined ? ObjectData.ScuessAppIds.length : 0) + (ObjectData.FaildAppIds != null && ObjectData.FaildAppIds != undefined ? ObjectData.FaildAppIds.length : 0);
							iSuccessCount = iSuccessCount + (ObjectData.ScuessAppIds != null ? ObjectData.ScuessAppIds.length : 0);
							if (ObjectData.FaildAppIds != undefined && ObjectData.FaildAppIds.length >0) {
								lstBatchfail.value = ObjectData.FaildAppIds;
							}
							// for (let toDIndx = 0; toDIndx < lstSelectedBill.length; toDIndx++) {
							// 	let toDelId = toDIndx[toDIndx];
							// 	//审批成功的才添加需要从列表中清除
							// 	this.c_delSort.push(toDelId.BillId)
							// }
							if (batchExcutedCount == batchSelectedCount) {
								//清理已处理单据
								// this.delDataList();
								// service.enjoyHideLoading();
								SuccessCount.value = iSuccessCount;
								FailCount.value = batchSelectedCount - iSuccessCount;
								// this.c_show = false;
								pageList.value.CurrentPage = 1;
								dataList.value = [];
								SetCurrentPages();
								onRefresh();
								EditUserData();
								//隐藏勾选
								if (lstBatchfail.value.length > 0) {
									popup3.value.open();
								}
							} else {
								service.enjoyShowToast('您勾选了' + e.length + '个，已审批' + batchExcutedCount +
									'个,正在审批第' + (batchExcutedCount + 1) + '个...');
							}

				        } else {
							SuccessCount.value = iSuccessCount;
							FailCount.value = batchSelectedCount - iSuccessCount;
							lstBatchfail.value.push({
								ErrInfo: res.data.Exception.Message,
								BillId: '异常信息'
							});
							if (FailCount.value > 0) {
								popup3.value.open();
							}
							pageList.value.CurrentPage = 1;
							dataList.value = [];
							SetCurrentPages();
							onRefresh();
							EditUserData();
							service.enjoyShowToast(res.data.Exception.Message)
				        }
				    }
					service.enjoyHideLoading();
				}, () => {
					service.enjoyHideLoading();
				    console.log('失败')
				});
				lstSelectedBill = [];
				batchId++;
			}
		}
	}
	const selStoreById =()=>{
		pageList.value.CurrentPage = 1;
		dataList.value = [];
		switch (industryTabIndex.value) {
			case '0':
			case 0:
				GetUnApproveListByBillType();
				break;
			case '1':
			case 1:
				GetApprovedListByBillType();
				break;
			case '2':
			case 2:
				GetMyApproveListByBillType();
				break;
			case '3':
			case 3:
				GetApproveFailListByBillType();
				break;
		}
	}
	// 下拉刷新
	const onRefresh = ()=>{
		if (triggered.value) {
			return false;
		};
		triggered.value = true;

		pageList.value.CurrentPage = 1;
		dataList.value = [];
		switch (industryTabIndex.value) {
			case '0':
			case 0:
				GetUnApproveListByBillType();
				break;
			case '1':
			case 1:
				GetApprovedListByBillType();
				break;
			case '2':
			case 2:
				GetMyApproveListByBillType();
				break;
			case '3':
			case 3:
				GetApproveFailListByBillType();
				break;
		}

		setTimeout(() => {
			triggered.value = false;
		}, 1000)
	}
	// 加载更多
	const templateLower = ()=>{
		if (pageList.value.CurrentPage < pageList.value.PageCount) {
			pageList.value.CurrentPage = pageList.value.CurrentPage + 1;
			if (industryTabIndex.value == 0||industryTabIndex.value == '0') {
				GetUnApproveListByBillType();
			} else if (industryTabIndex.value == 1||industryTabIndex.value == '1') {
				GetApprovedListByBillType();
			} else if (industryTabIndex.value == 2||industryTabIndex.value == '2') {
				GetMyApproveListByBillType();
			} else if (industryTabIndex.value == 3||industryTabIndex.value == '3') {
				GetApproveFailListByBillType();
			}
		}
	}
	const GetUnApproveListByBillType = () =>{
		service.enjoyShowLoading('正在加载...');
		let request = {
		    url: LoginStore.EnjoyMain,
		    data: {
		        UniqueKey: "管易通40审批",
		        ObjectData: {
					IsNotPage: false,
					PageSize: PageSize.value,
					Tag: {
						Search:searchValue.value,
						Type:approveInfo.value.BillRealType,//
						StartDt:searchInfo.value.StartDt,
						EndDt:searchInfo.value.EndDt,
						SendUser: '',
						UserNo:mainStore.loginInfo.sUser,
					},
					...pageList.value
				},//mainStore.loginInfo.sUser,
		        MethodName: "GetUnApproveListByBillType",
		    },
		}
		service.request(request, (res) => {
		    if (res && res.data) {
		        if (!res.data.HasException) {
					const ObjectData = res.data.ObjectData;
					console.log("ObjectData: " + JSON.stringify(ObjectData));
					pageList.value.RowsCount = ObjectData.RowsCount;
					pageList.value.PageCount = ObjectData.PageCount;
					pageList.value.CurrentPage = ObjectData.CurrentPage;

					const list = ObjectData.ReturnObject;
					if (list.length > 0) {
						list.map((item, index) => {
							const SName = item.StepName.replace('[', '');
							dataList.value.push({
								...item,
								BillName: approveInfo.value.BillType,
								BillRealName: item.BillRealType,
								c_checked: false,
								AppParamType: 3,
								StepName: SName.replace(']', ''),
								c_sort: index
							});
						})
					}else{
						uni.showToast({
							duration: 3500,
							icon: 'none',
							title: '没有待审批数据!',
							mask: true,
							duration: 3500,
						});
						// let self = this;
						// setTimeout(() => {
						// 	self.uniBack();
						// }, 500)
					}
		        } else {
		            service.enjoyShowToast(res.data.Exception.Message)
		        }
		    }
			service.enjoyHideLoading();
		}, () => {
			service.enjoyHideLoading();
		    console.log('失败')
		});
	}
	const GetApprovedListByBillType = () =>{
		service.enjoyShowLoading('正在加载...');
		let request = {
		    url: LoginStore.EnjoyMain,
		    data: {
		        UniqueKey: "管易通40审批",
		        ObjectData: {
					IsNotPage: false,
					PageSize: PageSize.value,
					Tag: {
						Search:searchValue.value,
						Type:approveInfo.value.BillRealType,//
						StartDt:searchInfo.value.StartDt,
						EndDt:searchInfo.value.EndDt,
						SendUser: '',
						UserNo:mainStore.loginInfo.sUser,
					},
					...pageList.value
				},//mainStore.loginInfo.sUser,
		        MethodName: "GetApprovedListByBillType",
		    },
		}
		service.request(request, (res) => {
		    if (res && res.data) {
		        if (!res.data.HasException) {
					const ObjectData = res.data.ObjectData;
					console.log("ObjectData: " + JSON.stringify(ObjectData));
					pageList.value.RowsCount = ObjectData.RowsCount;
					pageList.value.PageCount = ObjectData.PageCount;
					pageList.value.CurrentPage = ObjectData.CurrentPage;

					const list = ObjectData.ReturnObject;
					if (list.length > 0) {
						dataList.value.push(...list)
					}else{
						uni.showToast({
							duration: 3500,
							icon: 'none',
							title: '没有待审批数据!',
							mask: true,
							duration: 3500,
						});
						// let self = this;
						// setTimeout(() => {
						// 	self.uniBack();
						// }, 500)
					}
		        } else {
		            service.enjoyShowToast(res.data.Exception.Message)
		        }
		    }
			service.enjoyHideLoading();
		}, () => {
			service.enjoyHideLoading();
		    console.log('失败')
		});
	}
	const GetMyApproveListByBillType = () =>{
		service.enjoyShowLoading('正在加载...');
		let request = {
		    url: LoginStore.EnjoyMain,
		    data: {
		        UniqueKey: "管易通40审批",
		        ObjectData: {
					IsNotPage: false,
					PageSize: PageSize.value,
					Tag: {
						Search:searchValue.value,
						Type:approveInfo.value.BillRealType,//
						StartDt:searchInfo.value.StartDt,
						EndDt:searchInfo.value.EndDt,
						SendUser: '',
						UserNo:mainStore.loginInfo.sUser,
					},
					...pageList.value
				},//mainStore.loginInfo.sUser,
		        MethodName: "GetMyApproveListByBillType",
		    },
		}
		service.request(request, (res) => {
		    if (res && res.data) {
		        if (!res.data.HasException) {
					const ObjectData = res.data.ObjectData;
					console.log("ObjectData: " + JSON.stringify(ObjectData));
					pageList.value.RowsCount = ObjectData.RowsCount;
					pageList.value.PageCount = ObjectData.PageCount;
					pageList.value.CurrentPage = ObjectData.CurrentPage;

					const list = ObjectData.ReturnObject;
					if (list.length > 0) {
						dataList.value.push(...list)
					}else{
						uni.showToast({
							duration: 3500,
							icon: 'none',
							title: '没有待审批数据!',
							mask: true,
							duration: 3500,
						});
						// let self = this;
						// setTimeout(() => {
						// 	self.uniBack();
						// }, 500)
					}
		        } else {
		            service.enjoyShowToast(res.data.Exception.Message)
		        }
		    }
			service.enjoyHideLoading();
		}, () => {
			service.enjoyHideLoading();
		    console.log('失败')
		});
	}
	const GetApproveFailListByBillType = () =>{
		service.enjoyShowLoading('正在加载...');
		let request = {
		    url: LoginStore.EnjoyMain,
		    data: {
		        UniqueKey: "管易通40审批",
		        ObjectData: {
					IsNotPage: false,
					PageSize: PageSize.value,
					Tag: {
						Search:searchValue.value,
						Type:approveInfo.value.BillRealType,//
						StartDt:searchInfo.value.StartDt,
						EndDt:searchInfo.value.EndDt,
						SendUser: '',
						UserNo:mainStore.loginInfo.sUser,
					},
					...pageList.value
				},//mainStore.loginInfo.sUser,
		        MethodName: "GetApproveFailListByBillType",
		    },
		}
		service.request(request, (res) => {
		    if (res && res.data) {
		        if (!res.data.HasException) {
					const ObjectData = res.data.ObjectData;
					console.log("ObjectData: " + JSON.stringify(ObjectData));
					pageList.value.RowsCount = ObjectData.RowsCount;
					pageList.value.PageCount = ObjectData.PageCount;
					pageList.value.CurrentPage = ObjectData.CurrentPage;

					const list = ObjectData.ReturnObject;
					if (list.length > 0) {
						list.map((item, index) => {
							const SName = item.StepName.replace('[', '');
							dataList.value.push({
								...item,
								BillName: approveInfo.value.BillType,
								BillRealName: item.BillRealType,
								StepName: SName.replace(']', ''),
							});
						})
					}else{
						uni.showToast({
							duration: 3500,
							icon: 'none',
							title: '没有待审批数据!',
							mask: true,
							duration: 3500,
						});
						// let self = this;
						// setTimeout(() => {
						// 	self.uniBack();
						// }, 500)
					}
		        } else {
		            service.enjoyShowToast(res.data.Exception.Message)
		        }
		    }
			service.enjoyHideLoading();
		}, () => {
			service.enjoyHideLoading();
		    console.log('失败')
		});
	}
	const OpenApproveDetail = e =>{
			uni.navigateTo({
				url: './ApproveDetail?item='+JSON.stringify(e)+ '&tabIndex=' + industryTabIndex.value
			});
	}
	const SetCurrentPages = () =>{
		try {
			let pages = getCurrentPages();
			let prevPage = pages[pages.length - 2];
			const prevPageRoute = prevPage.route;
			if (prevPageRoute === 'pages/OaViews/Approve/index') {
				prevPage.$vm.$.exposed.onRefresh();
			}
			setTimeout(() => {
				eventBus.emit('refresh-HomeApprove');
			}, 500)
		} catch (e) {
		}
	}
	const onApproveCB = () => {
		onRefresh();
		setTimeout(() => {
			eventBus.emit('refresh-HomeApprove');
		}, 500)
	}
	onReady(()=>{
		uni.getSystemInfo({
			success: function(res) {
				const userInfoPage = uni.createSelectorQuery().select(".content-img");
				userInfoPage.boundingClientRect(function(data) {
					scrollHeight.value = (res.windowHeight - data.height - 10 )+'px';
				}).exec()
			}
		});
	})
	onLoad(e=>{
		approveInfo.value = JSON.parse(e.item);
		searchInfo.value.searchValue = e.search || '';
		searchInfo.value.StartDt = e.StartDt || '';
		searchInfo.value.EndDt = e.EndDt || '';
		searchInfo.value.sendUser = e.sendUser || '';
		industryTabIndex.value = e.current;
		searchValue.value = e.search || '';
		let page = '';
		if (e.current == 0||e.current == '0') {
			page = '待审批'
		} else if (e.current == 1||e.current == '1') {
			page = '已处理'
		} else if (e.current == 2||e.current == '2') {
			page = '已发起'
		} else {
			page = '被驳回'
		}
		c_title.value = page + approveInfo.value.BillRealType;
		if (e.current == 0||e.current == '0') {
			GetUnApproveListByBillType();
		} else if (e.current == 1||e.current == '1') {
			GetApprovedListByBillType();
		} else if (e.current == 2||e.current == '2') {
			GetMyApproveListByBillType();
		} else if (e.current == 3||e.current == '3') {
			GetApproveFailListByBillType();
		}
	})
	defineExpose({
		onRefresh,
		SetCurrentPages
	})
</script>

<style lang="scss" scoped>
	@import '@/main.scss';

	.iconfont {
		font-size: 21px;
		width: 40px;
		height: 100%;
		text-align: center;
		line-height: 37px;
		@include themeText("themeText");
	}

	.content-img {
		background-color: #FFFFFF;
		background-repeat: no-repeat;
		width: 100%;
	}

	.main-view {
		flex: 1;
		flex-direction: column;
		padding: 20rpx 20rpx 0 20rpx;
		background-color: #f2f2f2;
	}

	.approve-list {
		padding: 28rpx 28rpx 24rpx 28rpx;
		border-radius: 20rpx;
		background-color: #fff;
		line-height: 1;
		font-size: 14px;
	}

	.flex {
		display: flex;
	}

	.flex-1 {
		flex: 1;
	}

	.flex-direction-column {
		flex-direction: column !important;
	}

	.font-size-32 {
		font-size: 32rpx;
	}

	.font-weight-bold {
		font-weight: bold;
	}

	.justify-content-space-between {
		justify-content: space-between !important;
	}

	.align-items-center {
		align-items: center;
	}

	.margin-right-10 {
		margin-right: 10rpx;
	}

	.margin-top-24 {
		margin-top: 24rpx;
	}

	.margin-top-16 {
		margin-top: 16rpx;
	}

	.margin-bottom-20 {
		margin-bottom: 20rpx;
	}

	.status-radius {
		width: 8px;
		height: 8px;
		border-radius: 50%;
		background-color: #FF4000
	}

	.color-888 {
		color: rgba(136, 136, 136, 1);
	}

	.user-footer {
		position: fixed;
		z-index: 9;
		bottom: 0;
		left: 0;
		right: 0;
		height: 100rpx;
		background-color: #fff;
		display: flex;
		align-items: center;
		padding: 0 20rpx;
		font-size: 14px;
	}

	.ellipsis-2 {
		overflow: hidden;
		text-overflow: ellipsis;
		display: -webkit-box;
		-webkit-line-clamp: 2;
		-webkit-box-orient: vertical;
		line-height: normal;
		box-sizing: border-box;
	}

	.bill-title {
		width: 298px;
		display: block;
		word-wrap: break-word;
		line-height: normal;
	}

	.text-align-right {
		text-align: right;
	}

	.header-content {
		height: 88rpx;
		padding: 0 6px;
		background-color: #fff;
		align-items: center;
	}

	.justify-content-flex-end {
		justify-content: flex-end;
	}

	.padding-top-20 {
		padding-top: 20rpx;
	}

	.batchApproveResult {
		background-color: rgb(255, 255, 255);
		border-radius: 6px;
		font-size: 14px;
		width: 500rpx;
	}

	.batchApproveResult-error {
		font-size: 14px;
		font-weight: 400;
		color: #8f8f94;
		word-break: normal;
		width: auto;
		display: block;
		white-space: pre-wrap;
		word-wrap: break-word;
		overflow: hidden;
	}

	.font-size-28 {
		font-size: 28rpx;
	}

	// ::v-deep .u-tag__text--medium {
	// 	font-size: 12px;
	// 	font-weight: 600;
	// 	line-height: 12px;
	// }
	::v-deep .uni-checkbox-input {
		border-radius: 50%;
		// background: var(--theme-bgc-color);
		border: 1px solid var(--theme-color);
	}

	::v-deep .uni-checkbox-input svg {
		transform: translate(-100%, -100%) scale(1);
		background: var(--theme-bgc-color);
		border-radius: 50%;
		color: #fff !important;
		top: 22px;
		left: 22px;
	}

	::v-deep .uni-checkbox-input svg path {
		fill: #fff !important;
		transform: translate(10%, 10%) scale(0.8);
	}
</style>
